<template>
  <div>
    <Wrap>
      <!-- <div slot="main_wrap">
        <avue-crud ref="crud"
            :page.sync="page"
            :data="tableData"
            :permission="permissionList"
            :table-loading="tableLoading"
            :option="tableOption"
            @on-load="getList"
            @search-change="searchChange"
            @refresh-change="refreshChange"
            @size-change="sizeChange"
            @current-change="currentChange">
            <template slot="menuLeft">
              <el-button type="primary" @click="goUrl">预警统计</el-button>
            </template>
            <template slot="menu">
              <el-button type="text" @click="openDialog">处理</el-button>
            </template>
        </avue-crud>
      </div> -->
    </Wrap>
    <el-dialog
      :visible.sync="modal1"
      title="处理预警信息"
      width="900px"
      top="20vh"
      :close-on-click-modal="false"
      append-to-body>
      <div class="ck-designer">
          <el-form ref="form1" :model="form1" label-width="100px">
              <el-form-item label="报警内容:" prop="reason">
                  <el-input type="textarea" v-model="form1.reason" readonly></el-input>
              </el-form-item>
              <el-form-item label="报警时间:" prop="reason">
                  <el-date-picker
                    v-model="value1"
                    type="datetime"
                    style="vertical-align:top;width:33%;"
                    placeholder="选择日期时间">
                  </el-date-picker>
                  <label  style="width: 100px;vertical-align: top;margin-left: 5px;">处理时间:</label>
                  <el-date-picker
                    v-model="value1"
                    type="datetime"
                    style="vertical-align:top;width:33%;"
                    placeholder="选择日期时间">
                  </el-date-picker>
                   <label  style="width: 100px;vertical-align: top;margin-left: 5px;">处理人:</label>
                  <el-input v-model="form1.reason"  style="width: 18%"></el-input>
              </el-form-item>
              <el-form-item label="原因:" prop="reason">
                  <el-input type="textarea" v-model="form1.reason"></el-input>
              </el-form-item>
              <el-form-item label="意见:" prop="reason">
                  <el-input type="textarea" v-model="form1.reason"></el-input>
              </el-form-item>
              <el-form-item label="结果:">
                  <el-input type="textarea" v-model="form1.remark" ></el-input>
              </el-form-item>
          </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
          <el-button @click="modal1 = false">取 消</el-button>
          <el-button type="primary" @click="alarmHandle()">保存</el-button>
      </span>
  </el-dialog>
  </div>
</template>

<script type="text/ecmascript-6">
import Wrap from '@/components/energy-wrap'
import {tableOption} from '@/const/crud/energy/record'
import { meterRead } from '@/api/energy/energy'
export default {
  components: {
    Wrap
  },
  data () {
    return {
      form1: {},
      searchForm: {},
      tableData: [],
      modal1: false,
      page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 20 // 每页显示多少条
      },
      tableLoading: false,
      tableOption: tableOption
    }
  },
  computed: {
      permissionList() {
          return {
              addBtn: false,
              delBtn: false,
              editBtn: false
          };
      }
  },
  created() {
      // this.init()
  },
  methods: {
      goUrl() {
        this.$router.push({
          path: '/energy/alarm/total'
        })
      },
      alarmHandle() {

      },
      openDialog() {
        this.modal1 = true
      },
      getList(page, params) {
          this.tableLoading = true
          if (this.searchForm.dateRange) {
                this.searchForm.startDate = this.searchForm.dateRange[0];
                this.searchForm.endDate = this.searchForm.dateRange[1];
            }
          meterRead(Object.assign({
              current: page.currentPage,
              size: page.pageSize
          }, params, this.searchForm )).then(response => {
              this.tableData = response.data.data.records
              this.page.total = response.data.data.total
              this.tableLoading = false
          }).catch(() => {
              this.tableLoading=false
          })
      },
      sizeChange(pageSize){
          this.page.pageSize = pageSize
      },
      currentChange(current){
          this.page.currentPage = current
      },
      searchChange(form, done) {
          this.searchForm = form
          this.page.currentPage = 1
          this.getList(this.page, form)
          done()
      },
      refreshChange() {
          this.getList(this.page)
      }
  }
}
</script>

<style lang="scss" scoped>
</style>
